<template>
  <div class="index_one_content">
        <div class="index_top">
            <img :src="faceimg" alt="加载错误">
            <p class="title"><span>{{user}}</span> 在 <span>{{text}}</span> 马克了 </p>
            <span class="del">...</span>
        </div>
        <div class="index_middle"> 
            <img :src="mainimg" alt="">
        </div>
        <div class="index_details">
            <h3>{{title}}</h3>
            <div class="det_con">
                <p>
                    {{details}}
                </p>

            </div>
        </div>
        <div class="index_bottom">
            <!-- <span></span>
            <span></span>
            <span class="text">马克</span> -->
            <Make class="text"></Make>
        </div>
  </div>
</template>

<script>
import Make from "@/components/all_make.vue"
export default {
    components:{
        Make
    },
    methods:{
        jump_details(){
            this.$router.push("/no")
        }
    },
    props:["user","mainimg","text","faceimg","title","details"]
}
</script>

<style scoped>
.index_one_content{
    box-sizing: border-box;
    padding: 0 .22rem;
}
.index_top{
    height: .40rem;
    overflow: hidden;
}

.index_top>img{
    width: .25rem;
    height: .25rem;
    float: left;

}
.index_top .title{
    float: left;
    font-size: .12rem;
    margin: .07rem 0  0 .05rem;
}
.index_top .del{

    float: right;
}
.index_middle{
    width: 100%;
}
.index_middle>img{
    width: 100%;
}
.index_details{
    max-height: 2.2rem;
    margin-bottom: .13rem;
    overflow: hidden;
}

.index_details h3{
    font-size: .18rem;
    margin: .15rem 0 .2rem 0;
}
.index_details p{
    font-size: .14rem;
}
.index_details .det_con{

}
.index_bottom {
    margin-top: .1rem;
    margin-bottom: .4rem;
    text-align: center;
    
}
.index_bottom .text{
    display: inline-block;
    line-height: .45rem;
    height: .45rem;
    padding: 0 .2rem;
}
</style> 